
  <!-- <div>农事任务处理--单个编号</div> -->
  <template>
  <BaseMainSlot :show-tab-box="true">
    <template v-slot:tab-box>
      <div class="tabBox">
        <label style="min-width: 70px; margin-left: 80px">作业名称:</label>
        <SelectButton
          @updateQueryAllList="updateQueryAllList"
          @nowselectbuttonindex="workChange"
        />
      </div>
    </template>
    <template v-slot:search-box>
      <SearchForm
        :formConfig="formConfig"
        :formData="searchlist"
        @search="search"
      ></SearchForm>
    </template>
    <template v-slot:btn-box>
      <ActionBar
        :page-no="30"
        :has-add="false"
        :has-del="false"
        :has-edit="false"
        :has-cancel="false"
        :has-edit-column="false"
        @showColumn="showColumn"
      />
    </template>
    <template v-slot:table-box>
      <Table
        @sortChange="changeTableSort"
        :propList="tableColumn"
        v-loading="loading"
        :listData="tableData"
        :showSelectColumn="false"
        @handleSelectionChange="handleSelectionChange"
      >
        <template v-slot:svcObjPropertyList="{ row, item }">
          {{ getSvcObj(row, item.prop) }}
        </template>
        <template v-slot:operation="{ row }">
          <template v-if="!row.index && row.agriculturalTaskId">
            <template v-if="topitemtypeid === 0">
              <el-button
                type="text"
                class="text-btn-cursor"
                @click="information(row)"
                >任务详细信息</el-button
              >
              <el-button
                v-if="judgePermission(31, 'handle') && row.result !== '已完成'"
                type="text"
                class="text-btn-cursor"
                @click="handle(row)"
                >处理任务</el-button
              >
            </template>
            <template v-if="topitemtypeid === 1">
              <el-button
                type="text"
                class="text-btn-cursor"
                @click="information(row)"
                >任务详细信息</el-button
              >
              <el-button
                v-if="judgePermission(31, 'handle')"
                type="text"
                class="text-btn-cursor"
                @click="handle(row)"
                >处理</el-button
              >
              <el-button
                v-if="judgePermission(31, 'handle')"
                type="text"
                class="text-btn-cursor cursor-delete"
                @click="ToVoid(row)"
                >作废</el-button
              >
            </template>
            <template v-if="topitemtypeid === 2">
              <el-button
                type="text"
                class="text-btn-cursor"
                @click="distribute(row)"
                >查看详细信息</el-button
              >
            </template>
            <template v-if="topitemtypeid === 3">
              <el-button
                type="text"
                class="text-btn-cursor"
                plain
                @click="operation(row)"
              >
                查看详细信息
              </el-button>
            </template>
          </template>
        </template>
        <template v-slot:facilityBOList="{ row }">
          <template v-if="!row.index && row.agriculturalTaskId">
            <el-button
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="seeEquip(row)"
            >
              <i class="el-icon-view"></i> 查看
            </el-button>
          </template>
        </template>
        <template v-slot:agriculturalWorkTypeName="{ row, item }">
          <template v-if="!row.index && row.agriculturalTaskId">
            {{
              row.agriculturalWorkType
                ? row.agriculturalWorkType[item.prop]
                : ""
            }}
          </template>
        </template>
        <!-- 查看农资 -->
        <template v-slot:inputsRecordBOList="{ row }">
          <template v-if="!row.index && row.agriculturalTaskId">
            <el-button
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="seeEquips(row)"
            >
              <i class="el-icon-view"></i> 查看
            </el-button>
          </template>
        </template>
        <!-- 查看编号 -->
        <template v-slot:IdNameList="{ row }">
          <template v-if="!row.index && row.agriculturalTaskId">
            <el-button
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="seeIdNameList(row)"
            >
              <i class="el-icon-view"></i> 查看
            </el-button>
          </template>
        </template>
        <!-- 执行人 -->
        <template v-slot:personBOList="{ row }">
          <template v-if="!row.index && row.agriculturalTaskId">
            {{ row.personBOList ? row.personBOList[0].name : "" }}
          </template>
        </template>
        <template v-slot:execStartTime="{ row }">
          <template v-if="!row.index && row.agriculturalTaskId">
            {{ row.execStartTime }} - {{ row.execEndTime }}
          </template>
        </template>
      </Table>
      <Pagination
        :page-size="pageSize"
        :current-page="currentPage"
        :total-size="totalSize"
        @changePageSize="changePageSize"
        @changeCurrentPage="changeCurrentPage"
      />
    </template>
    <template v-slot:dialog>
      <!-- 作废 -->
      <el-dialog
        title="作废提示"
        :visible.sync="ToVoidVisible"
        width="30%"
        :before-close="handleClose"
        class="ToVoid"
      >
        <h2>确定作废此任务吗？</h2>
        <span>任务作废后无法处理</span>
        <span slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="ToVoidVisible = false"
            >取 消</el-button
          >
          <el-button class="zh-button-two" @click="ToVoidConfirm"
            >确 定</el-button
          >
        </span>
      </el-dialog>
      <!-- 处理结果  :before-close="handleClose"-->
      <el-dialog
        title="处理结果"
        @close="cancel"
        :visible.sync="handleVisible"
        class="handle"
      >
        <el-form
          ref="formDataHandle"
          label-position="left"
          :model="formDataHandle"
          :rules="rules"
          class="el-form"
        >
          <el-form-item label="使用农机名称:" class="w50p">
            <el-input v-model="formDataHandle.machinery" />
          </el-form-item>
          <el-form-item label="作业面积:" class="w50p">
            <el-input
              v-model="formDataHandle.workload"
              min="0"
              @change="formDataHandle.workload < 0 && ($set(formDataHandle, 'workload', 0))"
            />
          </el-form-item>
          <!-- 农资 -->
          <el-form-item
            style="
              position: relative;
              border: 1px dashed #00ffff;
              padding: 10px;
            "
            class="w100p"
            v-for="(item, index) in materialNum"
            :key="index"
          >
            <el-form-item label="投入农资" class="w33p">
              <el-select v-model="materialNos[index]" filterable clearable>
                <el-option
                  v-for="(item, index) in agriculturalMaterialList"
                  :key="index"
                  :label="item.materialName"
                  :value="item.materialNo"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="投入量:" class="w50p">
              <el-input
                type="number"
                v-model="assetQuantity[index]"
                min="0"
                @change="assetQuantity[index] < 0 && ($set(assetQuantity, index, 0))"
                placeholder="请输入投入量"
                clearable
                style="width: 80%;"
              />
            </el-form-item>
            <img
              src="@/assets/add.png"
              v-show="index === 0"
              @click="addMaterial"
              style="
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                right: 10px;
                cursor: pointer;
              "
            />
            <img src="@/assets/reduce.png" alt="" style="position: absolute;top: 8px; right: 0;cursor: pointer;" v-if="index>0" @click="reduce(index)">
          </el-form-item>
          <el-form-item label="作业人:" class="w50p" prop="personList">
            <el-select
              v-model="formDataHandle.personList"
              value-key="personNo"
              clearable
              multiple
            >
              <el-option
                v-for="(item, index) in staffList"
                :key="index"
                :label="item.person.name"
                :value="item"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="处理结果:" class="w50p">
            <el-input
              type="text"
              v-model="formDataHandle.remark"
              placeholder="请输入处理结果"
              clearable
            />
          </el-form-item>
          <el-form-item label="作业时间:" prop="processStartTime" class="w50p">
            <el-date-picker
              v-model="formDataHandle.processStartTime"
              value-format="timestamp"
              placeholder="请选择开始时间"
            />
          </el-form-item>
          <div style="width: 24px; text-align: center">-</div>
          <el-form-item class="w50p" prop="processEndTime">
            <el-date-picker
              v-model="formDataHandle.processEndTime"
              value-format="timestamp"
              style="width: calc(100% - 132px);"
              placeholder="请选择结束时间"
            />
          </el-form-item>
          <el-form-item
            v-for="item in svcData"
            :key="item.propertyCode"
            :prop="item.propertyCode"
            :label="`${item.propertyName}:`"
            :rules="item.required ? [{
              required: true,
              message: `${item.propertyName}不能为空`,
              trigger: ['change', 'blur'],
            }] : []"
            class="w50p"
          >
            <el-input
              v-if="item.propertyType == 1"
              v-model="formDataHandle[item.propertyCode]"
              :placeholder="`请输入${item.propertyName}`"
              clearable
            />
            <el-input
              v-if="item.propertyType == 2"
              v-model="formDataHandle[item.propertyCode]"
              type="number"
              :placeholder="`请输入${item.propertyName}`"
              clearable
            />
            <el-date-picker
              v-if="item.propertyType == 4"
              v-model="formDataHandle[item.propertyCode]"
              value-format="yyyy-MM-dd HH:mm:ss"
              type="datetime"
              :placeholder="`请选择${item.propertyName}`"
            />
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="cancel">取 消</el-button>
          <el-button class="zh-button-two" @click="handleChange">
            确 定
          </el-button>
        </span>
      </el-dialog>
      <!-- 任务详细信息弹出框 -->
      <el-dialog
        title="任务详细信息"
        :visible.sync="informationVisible"
        width="60%"
      >
        <el-form
          ref="formData"
          label-position="left"
          :model="formData"
          :rules="rules"
          class="el-form"
        >
          <el-form-item
            label="农事作业信息:"
            prop="agriculturalWorkTypeName"
            class="w50p"
          >
            <el-input v-model="formData.agriculturalWorkTypeName" disabled />
          </el-form-item>
          <el-form-item label="作业方式:" prop="method" class="w50p">
            <el-input v-model="formData.method" disabled />
          </el-form-item>
          <el-form-item label="批次名称:" prop="batchName" class="w50p">
            <el-input v-model="formData.batchName" disabled />
          </el-form-item>
          <el-form-item label="批次号:" prop="batchNo" class="w50p">
            <el-input v-model="formData.batchNo" disabled />
          </el-form-item>
          <el-form-item label="设施名称:" prop="facilityName" class="w50p">
            <el-input
              v-for="item in formData.facilityBOList"
              :key="item.facilityNo"
              v-model="item.facilityName"
              disabled
            />
          </el-form-item>
          <el-form-item
            v-if="formData.inputsRecordBOList"
            label="执行人:"
            prop="employeeName"
            class="w50p"
          >
            <el-input
              v-for="item in formData.personBOList"
              :key="item.personNo"
              v-model="item.name"
              disabled
            />
          </el-form-item>
          <el-form-item
            v-if="formData.inputsRecordBOList"
            label="投入农资名称 :"
            prop="agriculturalMaterialName"
            class="w50p"
          >
            <el-input
              v-for="item in formData.inputsRecordBOList"
              :key="item.materialNo"
              v-model="item.materialDTO.materialName"
              disabled
            />
          </el-form-item>
          <el-form-item
            v-if="formData.inputsRecordBOList"
            label="农资投入量:"
            prop="investmentVolume"
            class="w50p"
          >
            <el-input
              v-for="item in formData.inputsRecordBOList"
              :key="item.materialNo"
              v-model="item.assetQuantity"
              disabled
            >
              <template slot="append">
                {{ item.unitName }}
              </template>
            </el-input>
          </el-form-item>
          <!-- <el-form-item label="工作农机:" prop="equipmentName" class="w50p">
              <el-input v-model="formData.equipmentName" disabled />
            </el-form-item> -->
          <el-form-item label="通知时间:" prop="execStartTime" class="w50p">
            <el-input v-model="formData.execStartTime" disabled />
          </el-form-item>
          <el-form-item label="执行时间:" prop="execStartTime" class="w100p">
            <el-input v-model="formData.execStartTime" class="w50p" disabled />
            <div style="width: 24px; text-align: center">-</div>
            <el-input v-model="formData.execEndTime" class="w50p" disabled />
          </el-form-item>
          <el-form-item
            v-for="item in svcData"
            :key="item.propertyCode"
            :prop="item.propertyCode"
            :label="`${item.propertyName}:`"
            class="w50p"
          >
            <el-input
              v-if="item.propertyType == 1"
              v-model="formData[item.propertyCode]"
              clearable
              disabled
            />
            <el-input
              v-if="item.propertyType == 2"
              v-model="formData[item.propertyCode]"
              type="number"
              clearable
              disabled
            />
            <el-date-picker
              v-if="item.propertyType == 4"
              v-model="formData[item.propertyCode]"
              value-format="yyyy-MM-dd HH:mm:ss"
              type="datetime"
              disabled
            />
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="informationVisible = false"
            >取 消</el-button
          >
          <el-button class="zh-button-two" @click="informationVisible = false">
            确 定
          </el-button>
        </span>
      </el-dialog>
      <!-- 临时任务弹出框信息 -->
      <el-dialog
        title="任务详细信息"
        :visible.sync="operationVisible"
        width="60%"
        :before-close="handleClose"
      >
        <el-form
          ref="formData"
          label-position="left"
          :model="formData"
          :rules="rules"
          class="el-form"
        >
          <el-form-item
            label="农事作业信息:"
            prop="agriculturalWorkTypeName"
            class="w50p"
          >
            <el-input v-model="formData.agriculturalWorkTypeName" disabled />
          </el-form-item>
          <el-form-item label="作业方式:" prop="method" class="w50p">
            <el-input v-model="formData.method" disabled />
          </el-form-item>
          <el-form-item label="批次名称:" prop="batchName" class="w50p">
            <el-input v-model="formData.batchName" disabled />
          </el-form-item>
          <el-form-item label="批次号:" prop="batchNo" class="w50p">
            <el-input v-model="formData.batchNo" disabled />
          </el-form-item>
          <el-form-item label="设施名称:" prop="facilityName" class="w50p">
            <el-input
              v-for="item in formData.facilityBOList"
              :key="item.facilityNo"
              v-model="item.facilityName"
              class="w50p"
              disabled
            />
          </el-form-item>
          <el-form-item label="作业面积:" prop="procurementTime" class="w50p">
            <el-input v-model="formData.workload" disabled />
          </el-form-item>
          <el-form-item
            label="投入农资名称 :"
            prop="agriculturalMaterialName"
            class="w50p"
          >
            <el-input
              v-for="item in formData.inputsRecordBOList"
              :key="item.materialNo"
              v-model="item.materialDTO.materialName"
              disabled
            />
          </el-form-item>
          <el-form-item label="投入量:" prop="investmentVolume" class="w50p">
            <el-input
              v-for="item in formData.inputsRecordBOList"
              :key="item.materialNo"
              v-model="item.assetQuantity"
              disabled
            >
              <template slot="append">
                {{ item.unitName }}
              </template>
            </el-input>
          </el-form-item>
          <!-- <el-form-item label="农资损耗:" prop="loss" class="w50p">
              <el-input v-model="formData.loss" disabled />
            </el-form-item> -->
          <!-- <el-form-item label="工作农机:" prop="equipmentName" class="w50p">
              <el-input v-model="formData.equipmentName" disabled />
            </el-form-item> -->
          <el-form-item label="执行人:" prop="employeeName" class="w50p">
            <el-input
              v-for="item in formData.personBOList"
              :key="item.personNo"
              v-model="item.name"
              disabled
            />
          </el-form-item>
          <el-form-item label="任务执行时间:" prop="execStartTime" class="w50p">
            <el-input v-model="formData.execStartTime" disabled />
          </el-form-item>
          <el-form-item label="作业结果（备注）:" prop="remark" class="w50p">
            <el-input v-model="formData.remark" autosize disabled />
          </el-form-item>
          <el-form-item
            v-for="item in svcData"
            :key="item.propertyCode"
            :prop="item.propertyCode"
            :label="`${item.propertyName}:`"
            class="w50p"
          >
            <el-input
              v-if="item.propertyType == 1"
              v-model="formData[item.propertyCode]"
              clearable
              disabled
            />
            <el-input
              v-if="item.propertyType == 2"
              v-model="formData[item.propertyCode]"
              type="number"
              clearable
              disabled
            />
            <el-date-picker
              v-if="item.propertyType == 4"
              v-model="formData[item.propertyCode]"
              value-format="yyyy-MM-dd HH:mm:ss"
              type="datetime"
              disabled
            />
          </el-form-item>
        </el-form>
        <div v-if="formData.taskType !== '分发任务'" class="inputs-list-two">
          <!-- 投入记录项 -->
          <div class="title w100p">投入物资</div>
          <div
            v-for="(item, index) in inputsRecordBOList"
            :key="index"
            class="input-item w100p"
          >
            <div class="input-item-line w50p">
              <div class="lable">投入日期：</div>
              <div class="value">
                <el-date-picker
                  v-model="item.assetDate"
                  type="date"
                  disabled
                  placeholder="请选择投入日期"
                />
              </div>
            </div>
            <div class="input-item-line w50p">
              <div class="lable">投入农资名称：</div>
              <div class="value">
                <el-input v-model="item.materialDTO.materialName" disabled />
              </div>
            </div>
            <div class="input-item-line w50p">
              <div class="lable">投入量：</div>
              <div class="value">
                <el-input v-model="item.assetQuantity" disabled
                  ><template slot="append">
                    {{ item.unitName }}
                  </template></el-input
                >
              </div>
            </div>
            <!-- <div class="input-item-line w50p">
                <div class="lable">投入量单位：</div>
                <div class="value">
                  <el-select v-model="item.unitNo" disabled clearable>
                    <el-option
                      v-for="items in unitlist"
                      :key="items.unitNo"
                      :label="items.unitName"
                      :value="items.unitNo"
                    />
                  </el-select>
                </div>
              </div> -->
            <!-- <div class="input-item-line">
                <div class="lable">投入金额:</div>
                <div class="value">
                  <el-input v-model="item.assetValue" />
                </div>
              </div> -->
            <div class="input-item-line w50p">
              <div class="lable">经手人：</div>
              <div class="value">
                <el-input v-model="item.personName" disabled />
                <!-- <el-select v-model="item.personNo" disabled clearable>
                    <el-option
                      v-for="(items, indexs) in staffList"
                      :key="indexs"
                      :label="items.name"
                      :value="items.personNo"
                    />
                  </el-select> -->
              </div>
            </div>
            <!-- <div class="input-item-line">
                <div class="lable">备注:</div>
                <div class="value">
                  <el-input v-model="item.remark" type="textarea" />
                </div>
              </div> -->
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="operationVisible = false"
            >取 消</el-button
          >
          <el-button
            type="primary"
            class="zh-button-two"
            @click="operationVisible = false"
          >
            确 定
          </el-button>
        </span>
      </el-dialog>
      <!-- 分发任务弹出框信息 -->
      <el-dialog
        title="任务详细信息"
        :visible.sync="distributeVisible"
        width="60%"
        :before-close="handleClose"
      >
        <el-form
          ref="formData"
          label-position="left"
          :model="formData"
          :rules="rules"
          class="el-form"
        >
          <el-form-item
            label="农事作业类型:"
            prop="agriculturalWorkTypeName"
            class="w50p"
          >
            <el-input v-model="formData.agriculturalWorkTypeName" disabled />
          </el-form-item>
          <el-form-item label="作业方式:" prop="method" class="w50p">
            <el-input v-model="formData.method" disabled />
          </el-form-item>
          <el-form-item label="批次名称:" prop="batchName" class="w50p">
            <el-input v-model="formData.batchName" disabled />
          </el-form-item>
          <el-form-item label="批次号:" prop="batchNo" class="w50p">
            <el-input v-model="formData.batchNo" disabled />
          </el-form-item>
          <el-form-item label="设施名称:" prop="facilityName" class="w50p">
            <el-input
              v-for="(item, index) in formData.facilityBOList"
              :key="index"
              v-model="item.facilityName"
              class="w50p"
              disabled
            />
          </el-form-item>
          <el-form-item
            label="投入农资名称 :"
            prop="agriculturalMaterialName"
            class="w50p"
          >
            <el-input
              v-for="(item, index) in formData.inputsRecordBOList"
              :key="index"
              v-model="item.materialDTO.materialName"
              disabled
            />
            <!-- <el-input
                v-model="formData.agriculturalMaterialName"
                disabled
              /> -->
          </el-form-item>
          <el-form-item label="投入量:" prop="investmentVolume" class="w50p">
            <el-input
              v-for="(item, index) in formData.inputsRecordBOList"
              :key="index"
              v-model="item.assetQuantity"
              disabled
            >
              <template slot="append">
                {{ item.unitName }}
              </template>
            </el-input>
          </el-form-item>
          <!-- <el-form-item label="工作农机:" prop="equipmentName" class="w50p">
              <el-input v-model="formData.equipmentName" disabled />
            </el-form-item> -->
          <el-form-item label="执行人:" prop="personName" class="w50p">
            <el-input
              v-for="(item, index) in formData.personBOList"
              :key="index"
              v-model="item.name"
              disabled
            />
          </el-form-item>
          <el-form-item label="通知时间:" prop="noticeTime" class="w50p">
            <el-input v-model="formData.noticeTime" disabled />
          </el-form-item>
          <el-form-item label="执行时间:" class="w50p execdate">
            <el-input v-model="formData.execStartTime" class="w50p" disabled />
            <div style="width: 24px; text-align: center">-</div>
            <el-input v-model="formData.execEndTime" class="w50p" disabled />
          </el-form-item>
          <el-form-item v-if="formData.taskType !== '分发任务'" class="w100p">
            <h2 style="color: #000">任务处理信息</h2>
          </el-form-item>
          <el-form-item
            v-if="formData.taskType !== '分发任务'"
            label="任务处理时间: "
            class="w50p execdate"
          >
            <el-input v-model="formData.workStartTime" class="w50p" disabled />
            <div style="width: 24px; text-align: center">-</div>
            <el-input v-model="formData.workEndTime" class="w50p" disabled />
          </el-form-item>
          <el-form-item
            v-if="formData.taskType !== '分发任务'"
            label="作业面积:"
            prop="workArea"
            class="w50p"
          >
            <el-input v-model="formData.workload" disabled>
              <template slot="append">
                {{ formData.workloadUnitName }}
              </template>
            </el-input>
          </el-form-item>
          <el-form-item
            v-if="formData.taskType !== '分发任务'"
            label="完成度: "
            prop="loss"
            class="w50p"
          >
            <el-input v-model="formData.completeness" disabled />
          </el-form-item>
          <el-form-item
            v-if="formData.taskType !== '分发任务'"
            label="未完成设施: "
            prop="loss"
            class="w50p"
          >
            <el-input
              v-for="item in formData.unFinishFacilityBOList"
              :key="item.facilityNo"
              v-model="item.facilityName"
              disabled
            />
          </el-form-item>
          <el-form-item
            v-if="formData.taskType !== '分发任务'"
            label="作业结果:"
            prop="remark"
            class="w100p"
          >
            <el-input
              v-model="formData.remark"
              autosize
              placeholder="备注"
              disabled
            />
          </el-form-item>
          <el-form-item
            v-for="item in svcData"
            :key="item.propertyCode"
            :prop="item.propertyCode"
            :label="`${item.propertyName}:`"
            class="w50p"
          >
            <el-input
              v-if="item.propertyType == 1"
              v-model="formData[item.propertyCode]"
              clearable
              disabled
            />
            <el-input
              v-if="item.propertyType == 2"
              v-model="formData[item.propertyCode]"
              type="number"
              clearable
              disabled
            />
            <el-date-picker
              v-if="item.propertyType == 4"
              v-model="formData[item.propertyCode]"
              value-format="yyyy-MM-dd HH:mm:ss"
              type="datetime"
              disabled
            />
          </el-form-item>
        </el-form>
        <!-- <span slot="footer" class="dialog-footer">
            <el-button class="zh-button-one" @click="distributeVisible = false">取 消</el-button>
            <el-button class="zh-button-two" @click="distributeVisible = false">
              确 定
            </el-button>
          </span> -->
      </el-dialog>
      <el-dialog
        id="tableColumnDialog"
        title="配置列"
        :visible.sync="dialogTableColumnVisible"
      >
        <tableColumn
          v-if="dialogTableColumnVisible"
          ref="tableColumn"
          :tableColumn="allTableColumn"
          @cancelColumn="cancelColumn"
        />
        <div slot="footer" class="dialog-footer">
          <el-button
            class="zh-button-one"
            @click="dialogTableColumnVisible = false"
          >
            取 消
          </el-button>
          <el-button class="zh-button-two" type="primary" @click="saveColumn">
            保 存
          </el-button>
        </div>
      </el-dialog>
      <SeeEquip
        :is-show-equip="isShowEquip"
        :equip-data="facilityBOList"
        @closeDialog="isShowEquip = false"
      />
      <!-- 查看农资 -->
      <el-dialog
        title="投入农资信息"
        :visible.sync="showEquips"
        width="30%"
        class="dialogRec"
        @close="showEquips = false"
      >
        <div class="facility-list">
          <div
            v-for="(item, index) in inputsRecordBOList"
            :key="index"
            class="facility-item"
          >
            <!-- {{ item.facilityName }} -->
            <div class="info-line">
              <div class="name">投入农资名称：</div>
              <div class="value">{{ item.materialDTO.materialName }}</div>
            </div>
            <div class="info-line">
              <div class="name">投入量：</div>
              <div class="value">{{ item.assetQuantity }}</div>
            </div>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="showEquips = false"
            >关 闭</el-button
          >
        </span>
      </el-dialog>
      <!-- 查看编号 -->
      <el-dialog
        title="单个编号"
        :visible.sync="showIdNameList"
        width="30%"
        class="dialogRec"
        @close="showIdNameList = false"
      >
        <div style="overflow: hidden;">
          <div v-for="(item, index) in singleNoList" :key="index" style="float: left;">
            <div
              v-if="!!activeSingleNoList"
              class="IdNameList"
              :class="
                activeSingleNoList.includes(item)
                  ? 'IdNameList activeId'
                  : 'IdNameList'
              "
            >
              {{ item }}
            </div>
            <div v-else class="IdNameList">{{ item }}</div>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="showIdNameList = false"
            >关 闭</el-button
          >
        </span>
      </el-dialog>
    </template>
  </BaseMainSlot>
</template>
  
  <script>
import SearchForm from "@/components/searchForm";
import Table from "@/components/table/table.vue";
import ActionBar from "@/components/ActionBar";
import SeeEquip from "@/components/seeEquip/index.vue";
import Pagination from "@/components/Pagination";
import Selectbutton from "../components/selectbutton";
import agriculturalRecords from "@/api/digital-production/agricultural-work-management/agricultural-records-management";
import nowstaff from "@/api/digital-operation/personnel-cost-mansge/staff-manage/index";
import SelectButton from "@/components/selectbutton/index1.vue";
// 获取下拉框
import managementtwo from "@/api/digital-production/agr-input-management/agr-input-managementtwo";
import classificat from "@/api/digital-production/agricultural-work-management/agricultural-work-classification";
import nowpagereq from "@/api/basic-info-manage/agr-source-base-Manage/index";
import danwei from "@/api/basic-info-manage/unit-manage/index";
import userreq from "@/api/user/index";
import BaseMainSlot from "@/components/BaseMainSlot/newBaseMainSlot.vue";
import { mymixin } from "@/utils/mixin";
import moment from "moment";
import { mapGetters } from "vuex";
import { propertyTime, propertyTimeJoin } from "@/utils/time";
export default {
  name: "AgriculturalTaskProcessing",
  components: {
    SearchForm,
    Table,
    ActionBar,
    Pagination,
    BaseMainSlot,
    Selectbutton,
    SeeEquip,
    SelectButton,
  },
  mixins: [mymixin],
  data() {
    return {
      queryAllList: [],
      inputsRecordBOList: [],
      showEquips: false,
      showIdNameList: false,
      materialNum: 1,
      materialNos: [],
      assetQuantity: [],
      tableColumn: [],
      tableColumn1: [
        { prop: "batchName", label: "批次名称", minWidth: "140" },
        { prop: "batchNo", label: "批次号" },
        {
          prop: "facilityBOList",
          label: "设施名称",
          slotName: "facilityBOList",
        },
        {
          prop: "IdNameList",
          label: "编号",
          slotName: "IdNameList",
        },
        {
          prop: "inputsRecordBOList",
          label: "投入农资",
          slotName: "inputsRecordBOList",
        },
        {
          prop: "personBOList",
          label: "执行人",
          slotName: "personBOList",
        },
        {
          prop: "execStartTime",
          label: "执行时间",
          slotName: "execStartTime",
          width: "320",
        },
        {
          prop: "operation",
          label: "操作",
          slotName: "operation",
          width: "200",
        },
      ],
      formConfig: [
        {
          label: "状态",
          prop: "result",
          type: "selectbutton",
          options: [
            { itemTypeId: 0, itemTypeName: "待处理" },
            { itemTypeId: 1, itemTypeName: "已逾期" },
            { itemTypeId: 2, itemTypeName: "已完成" },
            { itemTypeId: 3, itemTypeName: "已作废" },
          ],
          sizeProp: "已逾期",
          numone: 0,
        },
        {
          label: "选择批次",
          prop: "batchNo",
          type: "select",
          options: [], // batchList
          optionKey: { label: "batchName", value: "batchNo" },
        },
        {
          label: "选择设施",
          prop: "facilityNo",
          type: "select",
          options: [], // facilityList
          optionKey: { label: "facilityName", value: "facilityNo" },
        },
        {
          label: "作业名称",
          prop: "agriculturalWorkTypeNo",
          type: "select",
          options: [], // queryAllList
          optionKey: {
            label: "agriculturalWorkTypeName",
            value: "agriculturalWorkTypeNo",
          },
        },
        {
          label: "农资名称",
          prop: "materialNo",
          type: "select",
          options: [], // queryagriculturalMaterialList
          optionKey: { label: "materialName", value: "materialNo" },
        },
        {
          label: "执行人",
          prop: "personNo",
          type: "select",
          options: [], // StaffList
          optionKey: { label: "personName", value: "personNo" },
        },
        {
          label: "选择时间",
          prop: "date",
          type: "daterange",
        },
      ],
      obj: {
        name: "",
      },
      logoImg: require("@/assets/logo.png"),
      //  标签栏相关
      activeName: "first",
      handleVisible: false,
      operationVisible: false,
      distributeVisible: false,
      informationVisible: false,
      ToVoidVisible: false,
      // 投入类型列表
      inputTypeList: [],
      routeName: "",
      // 当前页
      installationName: "",
      rules: {},
      // 选中的设施id数组 ID组成
      incomeCostIdList: [],
      // 柱状图相关值
      bottomtabdat: {},
      tabtype: false,
      agriculturalWorkType: {},
      batchVo: {},
      facilityVoList: [],
      scope: "",
      // 批次名称Id
      batchNo: "",
      // 设施
      facilityAList: [],
      // 设施Id
      facilityNo: "",
      // 农资
      AgriculturalList: [],
      agriculturalWorkTypeNo: "",
      // 搜索时间
      searchlist: {
        result: 0,
      },
      tagsList: [],
      method: "",
      unitlist: [],
      agriculturalMaterialList: [],
      materialNo: "",
      personNo: "",
      // 判断是否有农资损耗
      waste: "",
      // 人员
      staffList: [],
      employeeId: "",
      methodChange: true,
      topitemtypeid: 0,
      formDataHandle: {
        machinery: "",
        workload: "",
        personList: [],
        processStartTime: "",
        processEndTime: "",
        remark: "",
      },
      inputsRecordBOList: [],
      facilityBOList: [],
      isShowEquip: false,
      singleNoList: [],
      rules: {
        personList: [
          {
            required: true,
            message: "作业人不能为空",
            trigger: ["change", "blur"],
          },
        ],
        processStartTime: [
          {
            required: true,
            message: "开始时间不能为空",
            trigger: ["change", "blur"],
          },
        ],
        processEndTime: [
          {
            required: true,
            message: "结束时间不能为空",
            trigger: ["change", "blur"],
          },
        ],
      },
      svcData: [],
    };
  },
  computed: {
    ...mapGetters({
      judgePermission: "permission/judgePermission",
    }),
  },
  watch: {},
  created() {
    this.tableColumn = [ ...this.tableColumn1 ]
    this.getqueryAllList();
  },
  mounted() {},
  methods: {
    // TODO:作业类型切换
    workChange(data) {
      this.currentPage = 1;
      if (this.queryAllList.length > 0) {
        this.agriculturalWorkTypeName = data.agriculturalWorkTypeName;
        this.agriculturalWorkTypeNo = data.agriculturalWorkTypeNo;
        this.svcData = data.svcData ? data.svcData.classPropertyList : [];
        if (this.svcData) {
          let tableColumn = [ ...this.tableColumn1 ]
          tableColumn.splice(tableColumn.length - 1)
          this.svcData && this.svcData.map(el => {
            tableColumn.push({
              prop: el.propertyCode,
              label: el.propertyName,
              slotName: "svcObjPropertyList",
              width: "110",
            })
          })
          // 表格列
          tableColumn.push({
            prop: "operation",
            label: "操作",
            slotName: "operation",
            width: "200",
          })
          this.tableColumn = [...tableColumn]
        } else {
          this.tableColumn = [ ...this.tableColumn1 ]
        }
      }
      if (this.agriculturalWorkTypeNo) {
        this.getTableDataList();
      }
    },
    updateQueryAllList(list) {
      this.queryAllList = list
    },
    // 添加多个农资
    addMaterial() {
      this.materialNum++;
    },
    // 查看农资
    seeEquips(row) {
      console.log(row);
      this.inputsRecordBOList = row.inputsRecordBOList;
      this.showEquips = true;
    },
    // 查看编号
    async seeIdNameList(row) {
      let res = await agriculturalRecords.getNOList(row.batchNo);
      this.singleNoList = res.data.singleNoList;
      this.activeSingleNoList = [];
      row.singleMappers.forEach((el) => {
        this.activeSingleNoList.push(el.singleNo);
      });
      this.showIdNameList = true;
    },
    seeEquip(row) {
      this.facilityBOList = row.facilityBOList;
      this.isShowEquip = true;
    },
    // 获取表格数据
    getTableDataList(first) {
      if (first) {
        let params = {
          page: this.currentPage,
          size: this.pageSize,
          entity: {
            batchNo: this.searchlist.batchNo || undefined,
            farmingTypeNo: sessionStorage.farmingTypeNo,
            organizationNo: sessionStorage.organizationNo,
            agriculturalWorkTypeNo: this.agriculturalWorkTypeNo || undefined,
            facilityNo: this.searchlist.facilityNo || undefined,
            employeeId: this.employeeId || undefined,
            startTime: this.searchlist.date && this.searchlist.date[0],
            endTime: this.searchlist.date && this.searchlist.date[1],
            materialNo: this.searchlist.materialNo || undefined,
            personNo: this.searchlist.personNo || undefined,
            result: "已逾期",
          },
        };
        this.entity = params.entity;
        agriculturalRecords.getCulturalList(params).then((res) => {
          let data = res.data;
          if (data) {
            this.formConfig[0].numone = data.totalElements;
            console.log(this.formConfig[0].numone);
          }
        });
      }
      if (this.searchlist.result === 0) {
        this.searchlist.result = "待处理";
      } else if (this.searchlist.result === 1) {
        this.searchlist.result = "已逾期";
      } else if (this.searchlist.result === 2) {
        this.searchlist.result = "已完成";
      } else if (this.searchlist.result === 3) {
        this.searchlist.result = "已作废";
      }
      this.loading = true;
      let params = {};
      params = {
        page: this.currentPage,
        size: this.pageSize,
        sortList: this.sortList || [],
        entity: {
          batchNo: this.searchlist.batchNo || undefined,
          farmingTypeNo: sessionStorage.farmingTypeNo,
          organizationNo: sessionStorage.organizationNo,
          agriculturalWorkTypeNo: this.agriculturalWorkTypeNo || undefined,
          facilityNo: this.searchlist.facilityNo || undefined,
          employeeId: this.employeeId || undefined,
          startTime: this.searchlist.date && this.searchlist.date[0],
          endTime: this.searchlist.date && this.searchlist.date[1],
          result: this.searchlist.result || undefined,
          materialNo: this.searchlist.materialNo || undefined,
          personNo: this.searchlist.personNo || undefined,
          batchType: "SINGLE",
        },
      };
      this.entity = params.entity;
      agriculturalRecords.getCulturalList(params).then((res) => {
        this.loading = false;
        let data = res.data;
        if (data) {
          this.totalSize = data.totalElements;
          this.tableData = data.content;

          // this.tableData = [{ agriculturalTaskNo: 1 }];
        }
        this.addblankmet();
        this.resetActionBar();
      });
    },
    handleClose(done) {
      // this.$confirm('确认关闭？')
      //   .then(_ => {
      done();
      // })
      // .catch(_ => { });
    },
    // 获取下拉框数据
    getqueryAllList() {
      let params = {
        page: this.currentPage,
        size: this.pageSize,
      };
      // 获取单位选择框数据
      danwei.getallunitlist().then((res) => {
        this.unitlist = res.data;
      });
      classificat.getqueryAllList().then((res) => {
        let data = res.data;
        if (data.length > 0) {
          this.agriculturalWorkTypeNo = data[0].agriculturalWorkTypeNo;
          this.getTableDataList();
        }
        this.queryAllList = data;
        this.queryAllList.forEach((el) => {
          el["name"] = el.agriculturalWorkTypeName;
        });
        this.formConfig[3].options = data;
      });
      let param = {};
      if (this.nowChanceStau === "add") {
        param = {
          farmingTypeNo: sessionStorage.farmingTypeNo,
          batchType: "SINGLE",
        };
      } else {
        param = {
          farmingTypeNo: sessionStorage.farmingTypeNo,
          batchType: "SINGLE",
        };
      }
      // 获取批次选择框数据
      managementtwo.queryBatchList(param).then((res) => {
        this.formConfig[1].options = res.data;
      });
      let faciparams = {};
      if (this.nowChanceStau === "add") {
        faciparams = {
          organizationList: sessionStorage
            .getItem("organizationList")
            .split(","),
          farmingTypeNo: sessionStorage.getItem("farmingTypeNo"),
          facilityStatus: 1,
        };
      } else {
        faciparams = {
          organizationList: sessionStorage
            .getItem("organizationList")
            .split(","),
          farmingTypeNo: sessionStorage.getItem("farmingTypeNo"),
        };
      }
      userreq.getfacilityAll(faciparams).then((res) => {
        this.formConfig[2].options = res.data;
        this.facilityAList = res.data;
      });
      nowstaff.getStaffListByCondition().then((res) => {
        this.formConfig[5].options = res.data.map((el) => {
          return { ...el, personName: el.person?.name };
        });
      });
      // 农资
      managementtwo.getqueryList().then((res) => {
        this.formConfig[4].options = res.data;
      });
      nowpagereq.getqueryList().then((res) => {
        let data = res.data;
        // 赋值总条数
        // this.totalSize = data.totalElements;
        // 赋值数组
        this.agriculturalMaterialList = data;
      });
      // 获取执行人
      agriculturalRecords.getEmployeeList(params).then((res) => {
        let data = res.data;
        // 赋值总条数
        // 赋值总条数
        // this.totalSize = data.totalElements;
        // 赋值数组
        this.staffList = data;
        // console.log(this.staffList)
      });
    },
    // 时间格式
    dateFormat(row, colnum) {
      if (this.formData.agriculturalTaskId) {
        return moment(row[colnum.property]).format("YYYY-MM-DD");
      }
    },
    // 弹出框
    operation(row) {
      // this.formData = {};
      if (row.agriculturalWorkType) {
        this.operationVisible = true;
        // this.formData.agriculturalWorkTypeName =
        //   row.agriculturalWorkType.agriculturalWorkTypeName;
        this.formData = row;
        this.formData.agriculturalWorkTypeName =
          row.agriculturalWorkType.agriculturalWorkTypeName;
        this.formData.method = row.agriculturalWorkType.method;
        this.method = row.agriculturalWorkType.method;
        this.formData.batchNo = row.batchVo.batchNo;
        this.formData.batchName = row.batchVo.batchName;
        this.batchNo = row.batchVo.batchNo;
        this.handleSvcData(data)
      }
      // console.log(this.formData)
    },
    distribute(row) {
      // this.formData = {};
      if (row.agriculturalWorkType) {
        this.distributeVisible = true;
        // this.formData.agriculturalWorkTypeName =
        //   row.agriculturalWorkType.agriculturalWorkTypeName;
        this.formData = row;
        this.formData.agriculturalWorkTypeName =
          row.agriculturalWorkType.agriculturalWorkTypeName;
        this.formData.method = row.agriculturalWorkType.method;
        this.method = row.agriculturalWorkType.method;
        this.handleSvcData(data)
        // this.formData.batchNo = row.batchVo.batchNo;
        // this.formData.batchName = row.batchVo.batchName;
        // this.batchNo = row.batchVo.batchNo;
      }
    },
    // 任务详细信息弹框
    information(data) {
      console.log(data, "data");
      if (!data.agriculturalTaskNo) {
        this.$message.warning("请点击所需要选择的行");
        return;
      } else {
        if (data) {
          this.formData = data;
          this.formData.agriculturalWorkTypeName =
            data.agriculturalWorkType.agriculturalWorkTypeName;
          this.formData.method = data.agriculturalWorkType.method;
          // this.batchNo = data.batchNo;
          this.formData.facilityNoList = [];
          data.facilityBOList && data.facilityBOList.forEach((item) => {
            this.formData.facilityNoList.push(item.facilityNo);
          });
          this.handleSvcData(data)
          this.informationVisible = true;
        }
      }
    },
    handleSvcData(row) {
      // 自定义字段
      if (row.svcObjPropertyList && this.svcData) {
        this.svcData && this.svcData.map(el => {
          const val = this.getSvcObj(row, el.propertyCode)
          this.$set(this.formData, el.propertyCode, val)
        })
      }
    },
    getSvcObj(data, prop) {
      let val = ''
      if (data.svcObjPropertyList) {
        let row = data.svcObjPropertyList.find(el => {
          return el.propertyCode == prop
        })
        if (row) {
          val = row.textValue || row.numValue || ''
          if (row.propertyType == 4 && val) {
            val = propertyTimeJoin(val)
          }
        }
      }
      return val
    },
    // TODO:点击处理任务
    handle(data) {
      this.svcObjPropertyList = data.svcObjPropertyList || []
      console.log(data, "处理");
      this.formDataHandle = {
        ...data,
        processStartTime: JSON.parse(
          JSON.stringify(new Date(data.execEndTime).getTime())
        ),
        processEndTime: JSON.parse(
          JSON.stringify(new Date(data.execStartTime).getTime())
        ),
        remark: data.remark,
        batchNo: data.batchNo,
        facilityBOList: data.facilityBOList,
      };
      if (data.inputsRecordBOList) {
        this.materialNum = data.inputsRecordBOList.length;
        this.materialNos = [];
        this.assetQuantity = [];
        data.inputsRecordBOList.forEach((el, index) => {
          this.materialNos[index] = el.materialNo;
          this.assetQuantity[index] = el.assetQuantity;
        });
      }
      if (data.personBOList) {
        this.formDataHandle.personNoList = [];
        data.personBOList.forEach((el) => {
          this.formDataHandle.personNoList.push(el.personNo);
        });
        this.formDataHandle.personList = this.staffList.filter((el) => {
          return this.formDataHandle.personNoList.includes(el.personNo);
        });
      }
      // 自定义字段
      if (data.svcObjPropertyList && this.svcData) {
        this.svcData && this.svcData.map(el => {
          const val = this.getSvcObj(data, el.propertyCode)
          this.$set(this.formDataHandle, el.propertyCode, val)
        })
      }
      this.formDataHandle = { ...this.formDataHandle };
      this.handleVisible = true;
      // this.$nextTick(() => {
      //   this.$refs.formDataHandle.resetFields();
      // });
    },
    async handleChange() {
      this.formDataHandle.result = "已完成";
      let params = {};
      params = {
        agriculturalTaskNo: this.formDataHandle.agriculturalTaskNo,
        completeness: this.formDataHandle.completeness,
        remark: this.formDataHandle.remark,
        unFinishFacilityNoList:
          this.formDataHandle.facilityNoUnList || undefined,
        workEndTime: this.formDataHandle.processEndTime,
        workStartTime: this.formDataHandle.processStartTime,
        workload: this.formDataHandle.workload,
        personList: this.formDataHandle.personList,
        result: "已完成",
        batchNo: this.formDataHandle.batchNo,
        facilityBOList: this.formDataHandle.facilityBOList,
      };
      params.inputsRecordBOList = [];
      this.assetQuantity.forEach((el, index) => {
        params.inputsRecordBOList.push({
          assetQuantity: el,
          materialNo: this.materialNos[index],
          // exchangeRatio: this.exchangeRatio[index],
          // exchangeUnitNo: this.exchangeUnitNo[index] || "",
          organizationNo: sessionStorage.getItem("organizationNo"),
        });
      });
      params.personNoList = [];
      params.personList.forEach((el) => {
        params.personNoList.push(el.personNo);
      });
      params.facilityNoList = [];
      this.formDataHandle.facilityBOList.forEach((el) => {
        params.facilityNoList.push(el.facilityNo);
      });
      // console.log("单个处理", params);return;
      // 自定义字段
      if (this.svcData) {
        let svcObjPropertyList = []
        this.svcData.map(el => {
          let obj = { ...el }
          let val = el.propertyType == 2 ? 'numValue' : 'textValue'
          obj[val] = this.formDataHandle[el.propertyCode]
          if (el.propertyType == 4) {
            obj[val] = propertyTime(obj[val])
          }
          obj.svcObjId = this.svcObjPropertyList[0].svcObjId
          let svcObj = this.svcObjPropertyList.find(ele => { return ele.propertyCode == el.propertyCode })
          obj.id = svcObj.id
          svcObjPropertyList.push(obj)
        })
        params.svcClassId = this.svcData[0].svcClassId
        params.svcObjPropertyList = svcObjPropertyList
      }
      agriculturalRecords.editmeslist(params).then((res) => {
        if (res.code === 1) {
          this.method = "";
          this.batchNo = "";
          this.handleVisible = false;
          this.getTableDataList();
          this.$message.success("修改成功");
        } else {
          this.$message.error("修改失败");
        }
      });
      return;
      agriculturalRecords.editdeallist(params).then((res) => {
        if (res.code === 1) {
          this.method = "";
          this.batchNo = "";
          this.handleVisible = false;
          this.getTableDataList();
          this.$message.success("修改成功");
        } else {
          this.$message.error("修改失败");
        }
      });
    },
    // ToVoid 作废
    ToVoid(data) {
      this.formData = data;
      if (!this.formData.agriculturalTaskId) {
        this.$message.warning("请点击所需要选择的行");
        return;
      } else {
        if (this.formData) {
          this.ToVoidVisible = true;
        }
      }
    },
    ToVoidConfirm() {
      this.formData.result = "已作废";
      let params = this.formData;
      agriculturalRecords.eesultlist(params).then((res) => {
        if (res.code === 1) {
          this.method = "";
          this.batchNo = "";
          this.getTableDataList();
          this.ToVoidVisible = false;
          this.$message.success("修改成功");
        } else {
          this.$message.error("修改失败");
        }
      });
    },
    search() {
      this.currentPage = 1;
      this.getTableDataList();
    },
    changePageSize(pageSize) {
      this.pageSize = pageSize;
      this.getTableDataList();
    },
    changeCurrentPage(currentPage) {
      this.currentPage = currentPage;
      this.getTableDataList();
    },
    handleEdit(row) {
      // TODO 点击行元素后 edit
      if (row.agriculturalTaskId) {
        this.formData = row;
        // console.log(this.formData);
        this.formData.agriculturalWorkTypeName =
          row.agriculturalWorkType.agriculturalWorkTypeName;
        this.method = row.agriculturalWorkType.method;
        this.formData.batchNo = row.batchVo.batchNo;
        this.formData.batchName = row.batchVo.batchName;
        this.batchNo = row.batchVo.batchNo;
        // this.formData.execStartTime = new Date(row.execStartTime).getTime()
        // this.formData.execEndTime = new Date(row.execStartTime).getTime()
        // console.log(this.formData.execStartTime)
        // this.formData.facilityNoList = row.facilityVoList;
        this.formData.facilityNoList = [];
        row.facilityVoList.forEach((item) => {
          this.formData.facilityNoList.push(item.facilityNo);
        });
      }
    },
    handleSelectionChange(list) {
      this.agriculturalTaskIdList = [];
      this.agriculturalTaskIdList = list.map((item) => item.agriculturalTaskId);
      if (this.agriculturalTaskIdList.length > 0) this.delActive = true;
      else this.delActive = false;
    },
    cancel() {
      this.formData = {};
      this.materialNum = 1;
      this.assetQuantity = [];
      this.materialNos = [];
      this.handleVisible = false;
    },
    reduce(index) {
      this.materialNum--
      this.materialNos.splice(index,1)
      this.assetQuantity.splice(index,1)
    },
  },
};
</script>
  
  <style scoped lang="scss">
@import "~@/styles/variables.scss";
::v-deep .el-button--primary:hover {
  background: #fff;
  border-color: #fff;
  color: #66b1ff;
}
::v-deep .el-dialog {
  .el-dialog__header .el-dialog__title {
    color: #fff;
  }
  background-color: #005d7b;
  border: #23fff8 1px solid;
  .el-form {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    .el-form-item {
      display: flex;
      .el-form-item__label {
        min-width: 120px;
        text-align: end;
      }
      .el-input__inner {
        color: #000 !important;
        border: none;
        margin-bottom: 5px;
      }
    }
    .execdate {
      width: 100%;
      .el-form-item__content {
        display: flex;
      }
    }
  }
}

.button {
  height: 60px;
  max-width: 100%;
  display: flex;
  justify-content: flex-end;
  margin-right: 10px;
  padding: 10px;
}
::v-deep .common-layout {
  overflow-y: auto;
  .search-box {
    align-items: center;
    .label-input {
      margin-bottom: 0px;
      .label {
        text-align: end;
        padding-right: 10px;
      }
    }
    flex-wrap: wrap;
    .el-date-editor.el-input {
      width: 200px;
    }
    .date {
      display: flex;
      .date-ps {
        display: block;
        height: 36px;
        line-height: 36px;
        padding: 0 10px;
      }
    }
  }
}
.ToVoid {
  // ::v-deep .el-dialog {
  //   width: 30% !important;
  // }
  ::v-deep .el-dialog__body {
    color: red;
  }
}
::v-deep .common-layout {
  overflow-y: auto;
  .search-box {
    .label-input {
      margin-bottom: 10px;
      .label {
        text-align: end;
        padding-right: 10px;
      }
    }
    flex-wrap: wrap;
    .el-date-editor.el-input {
      width: 200px;
    }
    .date {
      display: flex;
      .date-ps {
        display: block;
        height: 36px;
        line-height: 36px;
        padding: 0 10px;
      }
    }
  }
  .zhcontent {
    height: 84% !important;
  }
}

// ::v-deep .el-table {
//   .el-button--medium {
//     padding: 0px 20px !important;
//     font-size: 14px;
//     border-radius: 4px;
//   }
// }

.common-search-item {
  ::v-deep .butt-list-sty {
    margin-bottom: 0;
  }
}
.inputs-list-two {
  display: inline-flex;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  .title {
    font-size: 20px;
    font-weight: 600;
  }
  .input-item {
    display: inline-flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    .input-item-line {
      display: inline-flex;
      align-content: center;
      align-items: center;
      margin-bottom: 10px;
      .lable {
        width: 120px;
        text-align: end;
        font-size: 16px;
        padding-right: 5px;
      }
      .value {
        width: calc(100% - 120px);
      }
    }
  }
}
// TODO: 查看投入物资
.facility-list {
  display: flex;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  .facility-item {
    width: 400px;
    max-width: 30%;
    min-width: 30%;
    margin-right: 3%;
    margin-bottom: 10px;
    // height: 80px;
    border-radius: 5px;
    // border: 1px solid #ccc;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.15);
    padding: 10px 20px;

    .info-line {
      display: flex;
      justify-content: flex-start;
      align-items: flex-start;
      font-size: 14px;
      &:not(:last-child) {
        margin-bottom: 10px;
      }
      .name {
        text-align: left;
        width: 100px;
        flex-shrink: 0;
      }
      .value {
        width: 100%;
        text-align: left;
        font-weight: normal;
      }
    }
  }
}
// 查看编号
.IdNameList {
  height: 33px;
  margin-right: 10px;
  padding: 0 5px;
  margin-bottom: 5px;
  color: #000;
  text-align: center;
  line-height: 33px;
  border: 1px solid #006e91;
}
.activeId {
  background-color: #006e91;
  color: #fff;
}
.tabBox {
  display: flex;
  width: 100%;
  max-height: 45px;
  padding-bottom: 10px;
  overflow: hidden;
  overflow-x: auto;
  scroll-margin-top: 50px;
  &::-webkit-scrollbar {
    width: 10px;
    height: 5px;
    border-radius: 10px;
  }
}
</style>
  